<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <style>
        #round {
            margin-top: 120px;
            background-color: white;
            border: 1px solid #dedede;
            border-radius:5px;            /* W3C syntax */
        }
        #form {
            margin-top: 50px;
        }
        #logo{
            margin-top: 30px;
            background-color: black;
        }
        .col-center-block {
            float: none;
            display: block;
            margin-left: auto;
            margin-right: auto;
        }
        #bottom{
            margin-bottom: 50px;
        }
        body{
            background-color:rgba(0,0,0,0.8);
        }
        .contents{
            background-image: url('http://org.weclassroom.com/img/login_bg.png');
            background-size: 100% ;
            background-repeat:no-repeat;
            width: 100%;
            height: 100%;
        }
        input{
            border-width:0 0 1px 0;
            border-color:#2f333d;
            border-radius: 0;
            box-shadow: none;
            outline: none;
            width: 100%;
            margin-top: 5px;
        }
    </style>
    <script>
        function login() {
            $.post("http://pre-api.weclassroom.com/admin/inslogin",{
                email:$("#username").val(),
                password:$("#password").val()
            },function(data){
                console.log(data)
                if(data.status){
                    alert("登录成功");
                }else{
                    alert(data.msg);
                }
            });
        }

    </script>
    <title>机构后台</title>
</head>
<!--style="-->
<!--background-image: url('http://org.weclassroom.com/img/login_bg.png');-->
<!--background-size: 100% ;-->
<!--background-repeat:no-repeat;"-->
<body>
<div class="container contents">
        <div class="col-xs-4 col-sm-4 col-md-4 col-sm-offset-4 col-md-offset-4" id="round">

                 <img id="logo" src="http://org.weclassroom.com/img/logo_simple.png" class="img-circle center-block" alt="Image">

                <div class=" col-xs-4 col-sm-4 col-md-4 col-sm-offset-4 col-md-offset-4" style="margin-top: 10px">
                    <label >weclassroom</label>
                </div>

                <div class="col-xs-6 col-md-6 col-center-block"  style="margin-top: 5px">
                    <label style="font-size: large">机构后台管理系统</label>
                </div>

                <form class="form-horizontal col-xs-10 col-sm-10 col-md-10 col-lg-10 col-sm-offset-1 col-md-offset-1" role="form" id="form" >
                    <div class="form-group">
                            <input type="text" id="username" placeholder="账号">
                    </div>

                    <div class="form-group">
                            <input type="password" id="password" placeholder="密码">
                    </div>

                    <div class="form-group" id="bottom">
                            <a type="submit" onclick="login()" class="btn btn-primary center-block">登陆</a>
                    </div>
                </form>
        </div>
</div>
</body>
</html>